<template>
	<view class="get_sms" @click="send" :class="{'disabled':disabled}">
		{{txt}} <text v-show="count">{{count}}</text>
	</view>
</template>

<script>
	import api from '../../consts/api.js'
	export default {
		props: ['tel'],
		data() {
			return {
				txt: '获取验证码',
				count: 0,
				timer: null,
				disabled: false
			};
		},
		methods: {
			send() {
				if (this.disabled) {
					return
				}
				let that = this
				uni.request({
					url: api.send,
					method: 'GET',
					data: {
						mobile: that.tel
					},
					success: res => {
						that.txt = '已发送'
						that.count = 60
						that.disabled = true
						that.timer = setInterval(() => {
							if (that.count > 0) {
								that.count--
							} else {
								that.count = 0
								that.txt = '获取验证码'
								that.disabled = false
								clearInterval(that.timer)
							}
						},1000)
					},
					fail: () => {},
					complete: () => {}
				});
				
			},
			sendAsync() {
				
			}
		},
		destroyed() {
			clearInterval(this.timer)
		}
	}
</script>

<style>
.disabled {
	background: #C8C7CC;
}
</style>
